<template>
  <div style="padding: 20px;">
    <h2 style="margin-bottom: 20px;">{{ isEdit ? '编辑营业总收入-单季度' : '新增营业总收入-单季度' }}</h2>
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" style="max-width: 800px;">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="股票代码" prop="stockCode">
            <el-input v-model="form.stockCode" placeholder="请输入股票代码"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="会计年度" prop="fiscalYear">
            <el-input-number
              v-model="form.fiscalYear"
              placeholder="请输入会计年度"
              :min="2000"
              :max="2099"
              style="width: 100%;"
              controls-position="right"
              @change="onFiscalYearChange"
            ></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-divider content-position="left">一季度</el-divider>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="一季度季末" prop="q1End">
            <el-date-picker
              v-model="form.q1End"
              type="date"
              placeholder="选择日期"
              style="width: 100%;"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="一季度营业收入" prop="q1Revenue">
            <el-input-number
              v-model="form.q1Revenue"
              placeholder="请输入营业收入"
              :precision="2"
              :min="0"
              style="width: 100%;"
              controls-position="right"
            ></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-divider content-position="left">二季度</el-divider>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="二季度季末" prop="q2End">
            <el-date-picker
              v-model="form.q2End"
              type="date"
              placeholder="选择日期"
              style="width: 100%;"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="二季度营业收入" prop="q2Revenue">
            <el-input-number
              v-model="form.q2Revenue"
              placeholder="请输入营业收入"
              :precision="2"
              :min="0"
              style="width: 100%;"
              controls-position="right"
            ></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-divider content-position="left">三季度</el-divider>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="三季度季末" prop="q3End">
            <el-date-picker
              v-model="form.q3End"
              type="date"
              placeholder="选择日期"
              style="width: 100%;"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="三季度营业收入" prop="q3Revenue">
            <el-input-number
              v-model="form.q3Revenue"
              placeholder="请输入营业收入"
              :precision="2"
              :min="0"
              style="width: 100%;"
              controls-position="right"
            ></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-divider content-position="left">四季度</el-divider>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="四季度季末" prop="q4End">
            <el-date-picker
              v-model="form.q4End"
              type="date"
              placeholder="选择日期"
              style="width: 100%;"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="四季度营业收入" prop="q4Revenue">
            <el-input-number
              v-model="form.q4Revenue"
              placeholder="请输入营业收入"
              :precision="2"
              :min="0"
              style="width: 100%;"
              controls-position="right"
            ></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item>
        <el-button type="primary" @click="onSubmit" :loading="submitLoading">保存</el-button>
        <el-button @click="onCancel">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "StockRevenueQuarterForm",
  data() {
    return {
      form: {
        id: '',
        stockCode: '',
        fiscalYear: null,
        q1End: '',
        q1Revenue: null,
        q2End: '',
        q2Revenue: null,
        q3End: '',
        q3Revenue: null,
        q4End: '',
        q4Revenue: null
      },
      rules: {
        stockCode: [
          { required: true, message: '请输入股票代码', trigger: 'blur' },
          { min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' }
        ],
        fiscalYear: [
          { required: true, message: '请输入会计年度', trigger: 'blur' },
          { type: 'number', min: 2000, max: 2099, message: '会计年度必须在2000-2099之间', trigger: 'blur' }
        ]
      },
      isEdit: false,
      submitLoading: false
    }
  },
  created() {
    // 判断是编辑还是新增模式
    const id = this.$route.query.id;
    if (id) {
      this.isEdit = true;
      this.loadDetail(id);
    } else {
      // 新增模式下，默认会计年度为当年
      const currentYear = new Date().getFullYear();
      this.form.fiscalYear = currentYear;
      // 自动设置季度末日期
      this.setQuarterEndDates(currentYear);
    }
    const stockCode = this.$route.query.code;
    if (stockCode) {
      this.form.stockCode = stockCode;
    }
  },
  methods: {
    loadDetail(id) {
      this.request.get("/stockRevenueQuarter/" + id).then(res => {
        if (res.code === 200) {
          this.form = res.data;
        }
      }).catch(() => {
        this.$message.error('加载数据失败');
      });
    },
    onSubmit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.submitLoading = true;
          this.request.post('/stockRevenueQuarter', this.form).then(res => {
            this.submitLoading = false;
            if (res.code === 200) {
              this.$message.success(this.isEdit ? '更新成功' : '添加成功');
              this.$router.push({ name: 'StockRevenueQuarter' });
            }
          }).catch(() => {
            this.submitLoading = false;
            this.$message.error('保存失败');
          });
        } else {
          this.$message.warning('请填写完整的表单信息');
          return false;
        }
      });
    },
    onCancel() {
      this.$router.push({ name: 'StockRevenueQuarter' });
    },
         onFiscalYearChange(newVal) {
       if (newVal && newVal >= 2000 && newVal <= 2099) {
         this.setQuarterEndDates(newVal);
       }
     },
     setQuarterEndDates(fiscalYear) {
       if (!fiscalYear) return;
       const year = fiscalYear;
       this.form.q1End = `${year}-03-31`;
       this.form.q2End = `${year}-06-30`;
       this.form.q3End = `${year}-09-30`;
       this.form.q4End = `${year}-12-31`;
     }
  }
}
</script>

<style scoped>
</style>
